﻿@model IEnumerable<FCNS.ERP.Models.ErpCategoryProduct>
@{
    Layout = null;
}

<!DOCTYPE html>

<html>
<head>
    <meta name="viewport" content="width=device-width" />
    <title>电子菜单</title>
    <link href="~/Content/Food/ShowFood.css" rel="stylesheet" />
    <script src="~/Scripts/jquery-1.12.4.js"></script>
    <script type="text/javascript">
        $(document).ready(function () {
            $.ajaxSettings.async = false;

            var yiXuan = new Array();//存储已选择的菜单[[id,[name,sumary,price,imgUrl,count]],[id,[name,sumary,price,imgUrl,count]]]

            $("#btnselect").click(function YiXuanOK() {

                if (yiXuan.length == 0) {
                    alert('已选菜单为空');
                }
                else {
                    var account = prompt("请输入【枱号：管理员账号：密码】 \n 用：号分隔(例如 101:admin:123)").split(":");
                    if (account.length == 3) {
                        var v = "";
                        for (var i = 0; i < yiXuan.length; i++) {
                            v += (yiXuan[i][0] + "." + yiXuan[i][5]+ ";");
                        }
                        $.get("/Public/OrderFoodIoInsert?seatName=" + account[0] + "&userNO=" + account[1] + "&pwd=" + account[2] + "&key=" + $("#currentCompanyKey").attr("value")+ "&food=" + v,
                            function (data, status) {
                                if (status == "success")
                                {
                                    if (data == "成功")
                                    {
                                        yiXuan.splice(0, yiXuan.length);
                                        alert('菜单提交成功');
                                        location.reload();
                                    }
                                    else
                                    {
                                        alert(data);
                                    }
                                }
                                else
                                {
                                    alert("远程服务器连接失败");
                                }
                            });
                    }
                    else {
                        alert("授权格式异常");
                    }
                }
            });

            function editYiXuan(id, name, summary, price, imgUrl, isAdd) {
                var haveItem = null;
                var haveItemIndex = -1;
                for (var i = 0; i < yiXuan.length; i++) {
                    if (yiXuan[i][0] == id) {
                        haveItem = yiXuan[i];
                        haveItemIndex = i;
                        break;
                    }
                }

                if (isAdd == true) {
                    if (haveItem == null) {
                        var arr = [id, name, summary, price, imgUrl, 1];
                        yiXuan.unshift(arr);
                    }
                    else {
                        haveItem[5] += 1;
                    }
                }
                else {
                    if (haveItem != null) {
                        var count = haveItem[5];
                        if (count < 2) {
                            yiXuan.splice(haveItemIndex, 1);
                        }
                        haveItem[5] -= 1;
                    }
                }

            }

            function formatHtml(id, name, summary, price, imgUrl, count) {
                var liHtml = '<li><div class="menu-img"><img src="' + imgUrl + '" width="55" height="55" /></div>';
                liHtml += '<div class="menu-txt"><h4>' + name + '</h4>';
                liHtml += '<p class="list1">' + summary + '</p>';
                liHtml += '<p class="list2"><b>￥' + price + '</b><div class="btn">';
                liHtml += '<button class="minus" ' + 'data-Id=' + id + ' data-Name=' + name + ' data-Summary=' + summary + ' data-Price=' + price + ' data-ImgUrl=' + imgUrl + '> <strong></strong></button>';
                liHtml += ' <i>' + count + '</i>';
                liHtml += '<button class="add"' + 'data-Id=' + id + ' data-Name=' + name + ' data-Summary=' + summary + ' data-Price=' + price + ' data-ImgUrl=' + imgUrl + '> <strong></strong></button>';
                liHtml += '<i class="price">' + price + '</i></div ></p ></div ></li > ';
                return liHtml;
            }

            function jss() {
                var m = $("#totalcountshow").html();
                if (m > 0) {
                    $(".right").find("a").removeClass("disable");
                } else {
                    $(".right").find("a").addClass("disable");
                }
            };

            $(".left-menu li").click(function () {
                var allString = '<ul>';

                if ($(this).attr("Id") == "YiXuan") {
                    $.each(yiXuan, function (i, field) {
                        allString += formatHtml(field[0], field[1], field[2], field[3], field[4], field[5]);
                    });
                }
                else {
                    $.getJSON("/Public/ShowFoodList?key=" + $("#currentCompanyKey").attr("value") + "&Id=" + $(this).attr("data-Id"),
                        function (data) {
                            $.each(data, function (i, field) {
                                allString += formatHtml(field.Id, field.Name, field.Summary, field.Price, field.ImgUrl, 0);
                            });
                        });
                }

                allString += '</ul>';
                $("#loadData").empty();
                $("#loadData").append(allString);
                if ($(this).attr("Id") == "YiXuan") {
                    $(".add").each(function () {
                        $(this).prevAll().css("display", "inline-block");
                    });
                }
                //加的效果
                $(".add").click(function () {
                    $(this).prevAll().css("display", "inline-block");
                    var n = $(this).prev().text();
                    var num = parseInt(n) + 1;
                    if (num == 0) { return; }
                    $(this).prev().text(num);
                    var danjia = $(this).next().text();//获取单价
                    var a = $("#totalpriceshow").html();//获取当前所选总价
                    $("#totalpriceshow").html((a * 1 + danjia * 1).toFixed(2));//计算当前所选总价

                    var nm = $("#totalcountshow").html();//获取数量
                    $("#totalcountshow").html(nm * 1 + 1);
                    jss();//<span style='font-family: Arial, Helvetica, sans-serif;'></span>   改变按钮样式
                    editYiXuan($(this).attr("data-Id"), $(this).attr("data-Name"), $(this).attr("data-Summary"), $(this).attr("data-Price"), $(this).attr("data-ImgUrl"), true);
                });
                //减的效果
                $(".minus").click(function () {
                    var n = $(this).next().text();
                    var num = parseInt(n) - 1;

                    $(this).next().text(num);//减1

                    var danjia = $(this).nextAll(".price").text();//获取单价
                    var a = $("#totalpriceshow").html();//获取当前所选总价
                    $("#totalpriceshow").html((a * 1 - danjia * 1).toFixed(2));//计算当前所选总价

                    var nm = $("#totalcountshow").html();//获取数量
                    $("#totalcountshow").html(nm * 1 - 1);
                    editYiXuan($(this).attr("data-Id"), $(this).attr("data-Name"), $(this).attr("data-Summary"), $(this).attr("data-Price"), $(this).attr("data-ImgUrl"), false);
                    //如果数量小于或等于0则隐藏减号和数量
                    if (num <= 0) {
                        $(this).next().css("display", "none");
                        $(this).css("display", "none");
                        jss();//改变按钮样式
                        return
                    }
                });
            });
        });
    </script>

</head>

<body>
    <input type="hidden" id="currentCompanyKey" value="@Request.QueryString["key"]" />
    <div class="main">
        <div class="left-menu">
            <ul>
                <li id="YiXuan">已选菜单<span class="num-price"></span></li>
                @foreach (var item in Model)
                {
                    <li data-Id="@item.Id">@item.Name<span class="num-price"></span></li>
                }
            </ul>
        </div>
        <div class="con">
            <div class="right-con con-active" id="loadData">

            </div>
        </div>
        <div class="con" id="YiXuanList">

        </div>

        <div class="footer">
            <div class="left">
                已选：
                <span id="cartN">
                    <span id="totalcountshow">0</span>份　总计：￥<span id="totalpriceshow">0</span>
                </span>元
            </div>
            <div class="right">
                <a id="btnselect" class="xhlbtn  disable">去结算</a>
            </div>
        </div>
    </div>

</body>
</html>
